<!-- 个人中心——联系我们 -->
<template>
	<view class="contact-us-page">
		<image src="https://z4a.net/images/2023/10/10/-11bcfecedeb5c97e0.jpg" mode="widthFix"></image>
		<view class="display-a p-content" v-if="basicConfiguration.platform_phone">
			<image src="https://z4a.net/images/2023/10/10/Vector.png" mode="widthFix"
				style="width: 68rpx;height: 68rpx;margin-right: 20rpx;"></image>
			<view class="msg-info flex-columns" @click="callPhone(basicConfiguration.platform_phone)">
				<text>平台电话 | TEL</text>
				<view style="color: blue;">{{basicConfiguration.platform_phone}}</view>
			</view>
		</view>
	
		<view class="display-a p-content" v-if="basicConfiguration.platform_email" @click="getCopy(basicConfiguration.platform_email)">
			<image src="https://z4a.net/images/2023/10/10/Group-123.png" mode="widthFix"
				style="width: 68rpx;height: 68rpx;margin-right: 20rpx;"></image>
			<view class="msg-info flex-columns">
				<text>邮箱 | Mailbox</text>
				<view>{{basicConfiguration.platform_email}}</view>
			</view>
		</view>

		<view class="display-a p-content" v-if="basicConfiguration.customer_service">
			<image src="https://z4a.net/images/2023/10/10/Vector.png" mode="widthFix"
				style="width: 68rpx;height: 68rpx;margin-right: 20rpx;"></image>
			<view class="msg-info flex-columns" @click="callPhone(basicConfiguration.customer_service)">
				<text>客服电话 | TEL</text>
				<view style="color: blue;">{{basicConfiguration.customer_service}}</view>
			</view>
		</view>

		<view class="display-a p-content" v-if="basicConfiguration.platform_address">
			<image src="https://z4a.net/images/2023/10/10/Group-3152.png" mode="widthFix"
				style="width: 68rpx;height: 68rpx;margin-right: 20rpx;"></image>
			<view class="msg-info flex-columns">
				<text>地址 | address</text>
				<view>{{basicConfiguration.platform_address}}</view>
			</view>
		</view>


		<view class="code" v-if="basicConfiguration.customer_qr">
			<image @click="getImg()" class="kf-img" :src="basicConfiguration.customer_qr"></image>
			<view class="">扫一扫添加好友</view>
		</view>
		
		<view style="height: 20rpx;"></view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				userInfo: uni.getStorageSync("userInfo"),
				basicConfiguration:{},
			};
		},

		onLoad() {
			
			this.basicConfigurationFn()
		},

		onShow() {

		},
		methods: {
			
			async basicConfigurationFn() {
				const result = await this.$http.post({
					url: this.$api.config,
					data: {
			
			
					},
					headers: {
						'Authorization': this.userInfo.token
					}
			
				})
				if (result.code == 0) {
					console.log(result)
					this.basicConfiguration = result.data
					wx.setStorageSync('system', result.data);
					
					
			
				}
			},

			//复制
			getCopy(text) {
				if (text) {
					uni.setClipboardData({
						data: text,
						success: () => {
							// 复制成功的回调
							uni.showToast({
								title: '复制成功',
								icon: 'none',
								duration: 4000
							});
						},
						fail: () => {
							// 复制失败的回调
							uni.showToast({
								title: '复制失败',
								icon: 'error'
							});
						}
					});
				}
			},

			//预览图片
			getImg() {
				uni.previewImage({
					urls: [this.basicConfiguration.customer_qr],
				});
			},

			//拨打电话
			callPhone() {
				if (this.basicConfiguration.customer_service) {
					this.$sun.phone(this.basicConfiguration.customer_service);
				} else {
					this.$sun.toast("暂无联系方式", 'error');
				}
			},

		}
	};
</script>

<style lang="less">
	.kf-img {
		width: 200rpx;
		height: 200rpx;
	}

	.contact-us-page {
		// image {
		// 	width: 100%;
		// }

		.p-content {
			margin: 0 20rpx;
			padding: 40rpx 10rpx 36rpx;
			border-bottom: 2rpx solid #EAEAEA;
			position: relative;

			.icon-size {
				font-size: 64rpx;
				margin-right: 40rpx;
				color: #19C866;
			}

			.msg-info {
				text {
					color: #999999;
					font-size: 26rpx;
				}

				view {
					font-size: 32rpx;
					margin-top: 10rpx;
				}
			}
		}
	}

	button {
		background: white;
		border: none;
		text-align: left;
		margin: 0 !important;
		padding: 0 !important;
		padding: 0px 20rpx;
		font-size: 30rpx;
		margin-top: 10rpx;
		width: 100%;
		display: block;
		color: #000 !important;
	}

	button::after {
		border: none;
	}

	.code {
		text-align: center;
		margin: 50rpx 0 0;
	}

	page {
		background-color: #FFFFFF;
		border-top: none;
	}
</style>
